/**http数据传输方式（5种）
 * 1.url param:  /xx/xx/xx （不需要编码解码utf8）
 * 2.url query:  http://xxxx?key1=value1&key2=value2... 需要encodeURIComponent编码
 * 3.form-urllencondeed表单提交,区别就是query放在了body里, 也需要编码，content-type 是 application/x-www-form-urlencoded,
 * 4.form-data, 就是http请求中的multipart/form-data
 *  会将表单的数据处理为一条消息，以标签为单元，用分隔符分开。
 *  既可以上传键值对，也可以上传文件。当上传的字段是文件时，会有Content-Type来说明文件类型；content-disposition，用来说明字段的一些信息；但字段很长
 * 5.json： content-type:application/json （推荐！ 不用编码，且可以多文件，键值对传输数据）
* 

/**MFA多身份认证
 * 案例: https://account.mongodb.com/account/security/mfa/setup
 */

/**计算机网络
 * 七层协议(OSI): 
 *     应(规范/接口)、
 *     表(加密/解密)、
 *     会(建立连接/管理会话)、
 *     传(分包/传输数据)、
 *     网(数据传输需要经过很多点,规定怎么转发,下一个目标地址)、
 *     数(ip数据报组装成帧)、
 *     物(传输单位:比特,实现相邻计算机节点比特流透明传送)
 * 五层协议(广泛使用): 应、传、网、数、物)
 * TCP/IP: 应(http,ftp,dns)、传(tcp,udp)、网络层(ip,arp地址解析)、数据链路层(ppp)
 */

/**三次握手,四次挥手 */

/*HTTP
http是一种无状态的超文本传输协议,属于应用层协议，是一种规范。

http请求报文:
请求行:url|method|http版本
请求头:host|user-agent|accept|accept-encoding|accept-language|cookie|referer
空行:（报头部分结束）
请求正文:post会携带body(get请求正文为空,不是没有)

http响应报文：
状态行:url|method|状态码|ip地址
响应头:Content-Type|Date|Server|压缩|cache-control|set-cookie
空行:
响应正文:*/

/*HTTP版本区别 */

/*HTTPS*/

/*HTTP缓存
 服务器设置响应头字段 

 默认：静态资源图片，js会强缓存（max-age：几小时或者几天），其他动态（服务器动态生成）的内容不走缓存
 
 强缓存(缓存时间内不会发起请求,状态码200。强缓存失效会发起协商缓存。)
   cache-control: public (响应可以被任何缓存)| max-age=30000000(缓存时间) | no-cache(使用协商缓存) | no-store(禁止缓存) | private(只允许用户的浏览器缓存,代理服务器不能缓存) 
 
    
   nginx设置方式: add_header cache-control max-age=0 / no-cache  (etag|last-modified一般会自动携带)
   
           响应头 | 请求头 : 含义
   方式一:  etag  | if-none-match: 文件唯一标识符 （服务器对比如果一致说明没过期，返回304状态码）
   方式二:  last-modified|if-modified-since: 最后修改时间  (如果服务器的last-modified有变化,缓存资源的last-modified会更新)

 如果没过期就走客户端缓存
*/

/**浏览器什么情况下会发起两次请求?
 * 1.设置了协商缓存的资源过期了,没有返回304(直接走缓存),会再次发起请求。
 * 2.服务器返回了重定向响应
 * 3.跨域请求: 在非简单请求的情况下，跨域请求可能会导致浏览器发起两次请求，因为浏览器会先发送一个 OPTIONS 请求进行预检，然后再发送实际的请求。
 */









/*使用WebSocket连接需要经过服务器端的同意。在建立WebSocket连接时，
客户端会向服务器发送一个特殊的HTTP请求，称为"升级请求"。这个请求的目的是将HTTP连接升级为WebSocket连接。

服务器在接收到升级请求后，会进行以下处理：

验证HTTP请求的有效性：服务器会检查HTTP请求头的合法性，以确保请求是由合法的客户端发送的。
选择WebSocket协议版本：服务器会选择一个WebSocket协议版本，并将其返回给客户端。
返回101状态码：一旦服务器同意升级请求并选择了WebSocket协议版本，它会返回一个状态码为101的响应。这个响应告诉客户端WebSocket连接已经成功建立，现在可以使用WebSocket协议进行通信了。
因此，要使用WebSocket连接，必须经过服务器同意并返回101状态码。这是WebSocket连接建立过程中的必要步骤。 */
/*SSE (server sent events) 
  服务器向客户端推送数据。服务端返回的 Content-Type 是 text/event-stream，
  这是一个流，可以多次返回内容。(断开会自动重连,websocket需要手动操作)
*/
/*EventSource 
EventSource对象是HTML5标准的一个新api，用于接收服务器发送的事件消息的对象。
每个接收到的事件都会导致我们的 EventSource 对象的 onmessage 事件处理程序运行。
除非手动eventSource.close()断开连接，否则EventSource断开也会自动重连。
*/
//WebRTC、EventSource

















//浏览器存储(四种方式)





/*Web Storage:给浏览器提供了更方便的存储API，比cookie简单。

    localStorage     除非手动删除,否则没有过期时间限制  setItem|getItem|removeItem|clear。
     作用：保存非重要、数据量不大的数据
     例子：用户习惯 
    sessionStorage   可以访问当前源的storage对象，是会话存储,API和loca一致
     作用：保存临时数据,毕竟是会话。 
     例子：监测用户是否是刷新进入页面，如音乐播放器恢复进度条功能 
    
     特点：
     重新加载或者恢复页面会保持会话,关闭页面会话消失。
     打开多个相同的 URL 的 Tabs 页面，会创建各自的 sessionStorage。
*/

/*cookie: 基于http
    后端设置-浏览器会自动保存起来-之后该域名下的所有请求会自动携带(在请求头Cookie)。若设定cooike时指定了domain=.example.com，那么子域名也可以携带。
      首次请求/缓存过期响应头: Set-cookie：key1=value1;secure(https才会发送cookie);Expires=过期时间UTC格式;max-age=;过期相对时间..

    前端设置:
      document.cookie="key=value..."; (如果新增的key是已有的,会覆盖原有的cookie值,如果是没有的会添加到末尾)
    缺点: 长度有限，当个cookie不超过4kb
         使用不方便，没有原生api支持，需要用户自己结构字段，不过网络上有人封装了相关库可以使用
         每次请求都会携带cookie
    携带: 目标域名设置了允许携带cookie的响应头才会携带cookie
      
    例子-记住用户密码:
      1、首次登录成功,会给用户生成一个SESSION_ID(签名) => 保存在数据库(安全)|redis(读取速度块,内存有限)|file(速度一般)
      2、并设置响应头字段，set-cookie:SESSION_ID=XXXX;max-age 
      3、下次访问网站,请求头会自动携带Cookie字段,里面就保存者服务器给你的SESSION_ID
      4、服务器会查询数据库用户表，若有该用户信息，就返回
      直到cookie过期，会话结束。需要重新输入账号密码。
*/

//数据库存储:IndexedDB、Web SQL

/* cache Storage | Aplication cache:*/